<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>Bootstrap Admin</title>
    <meta content="IE=edge,chrome=1" http-equiv="X-UA-Compatible">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="description" content="">
    <meta name="author" content="">

    <% include ../includePage/refResource.html %>

    <!-- Le HTML5 shim, for IE6-8 support of HTML5 elements -->
    <!--[if lt IE 9]>
    <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
    <![endif]-->
</head>
<!--[if lt IE 7 ]>
<body class="ie ie6"> <![endif]-->
<!--[if IE 7 ]>
<body class="ie ie7 "> <![endif]-->
<!--[if IE 8 ]>
<body class="ie ie8 "> <![endif]-->
<!--[if IE 9 ]>
<body class="ie ie9 "> <![endif]-->
<!--[if (gt IE 9)|!(IE)]><!-->
<body class="">
<!--<![endif]-->

<% include ../includePage/header.html %>

<% include ../includePage/navigation.html %>

<div class="content">

    <div class="articleContent">
    <h2 class="box"><a href="/article/articleManager/">add Article</a></li></a></h2>

    <div class="row-fluid">
        <% for (var i = 0;i<articleItem.length; i++) {
        var article = articleItem[i];
        %>
        <% if(i%3==0){%>
    </div>
    <%}%>
    <% if(i%3==0){%>
    <div class="row-fluid">
        <%}%>
        <div class="span4">
            <a title="基于 Sass 和 Compass 构建的CSS按钮（button）样式库" href="/p/buttons/" target="_blank">
                <img class="marketing-img lazy" src="<%= article.logoSrc %>" width="300" height="150" data-src="assets/img/buttons.png"></a>
                <h2>
                    <%= article.articleType %>
                </h2>
                <p>
                    <%- article.describe%>
                    <a class="btn" href="/article/articleManager/<%- article._id%>">Edit</a>
                </p>
        </div>
        <%} %>
    </div>
    </div>
    </div>

    <script src="/js/lib/bootstrap/bootstrap.js"></script>
    <script type="text/javascript" src="/js/lib//bootstrap-paginator.min.js"></script>
    <script type="text/javascript">
        $(function () {
            //获得浏览器参数
            $.extend({
                getUrlVars:function () {
                    var vars = [], hash;
                    var hashes = window.location.href.slice(window.location.href.indexOf('?') + 1).split('&');
                    for (var i = 0; i < hashes.length; i++) {
                        hash = hashes[i].split('=');
                        vars.push(hash[0]);
                        vars[hash[0]] = hash[1];
                    }
                    return vars;
                },
                getUrlVar:function (name) {
                    return $.getUrlVars()[name];
                }
            });

            //封装浏览器参数
            var composeUrlParams = function () {
                var param = '';
                $.each($.getUrlVars(), function (i, item) {
                    if (item != 'p') {
                        var val = $.getUrlVar(item);
                        if (val) param += "&" + item + "=" + val;
                    }
                });
                return param;
            }


            //分页功能
            var options = {
                currentPage:2,
                totalPages:5,
                numberOfPages:5
            }
            //分页功能
            var page = $('#page1');
            var options = {
                currentPage:page.attr('pageNum'),
                totalPages:page.attr('pageCount'),
                numberOfPages:page.attr('numberOfPages'),
                pageUrl:function (type, page, current) {
                    return "/article/listContext?" + composeUrlParams() + "&p=" + page;
                }
            }
            $('#page1').bootstrapPaginator(options);
        });
    </script>

</body>
</html>


